<template>
  <el-dialog
    :title="title"
    :visible.sync="$attrs.visableIf"
    @close="handleCloseDialog"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    append-to-body
    width="640px"
  >
    <div class="infocondition c_text3">
      <!-- 客户群条件 -->
      <div class="line_h_22">客户群符合以下条件</div>
      <div class="divide"></div>
      <div class="flex mb-8">
        <div class="citem_title line_h_22">含任意关键词：</div>
        <div class="citem_content">
          <span class="tags">试试</span>
        </div>
      </div>
      <div class="flex mb-8">
        <div class="citem_title line_h_22">含任意群标签：</div>
        <div class="citem_content">
          <span class="tags">试试</span>
        </div>
      </div>
      <!-- 所有 -->
      <!-- <span class="c_text3">所有客户群</span> -->
    </div>
    <div slot="footer">
      <el-button type="primary" size="small" @click="handleCloseDialog">关闭</el-button>
    </div>
  </el-dialog>
</template>
<script>
export default {
  data() {
    return {};
  },
  props: {
    title: {
      type: String,
      default: "",
    },
  },
  methods: {
    handleCloseDialog() {
      this.$emit("update:visableIf", false);
      this.$emit("handleQuery");
    },
  },
};
</script>

<style lang="scss" scoped>
.infocondition {
  padding: 8px;
  margin-bottom: 8px;
  background: #fff;
  border-radius: 2px;
  border: 1px solid #e9e9e9;
}
.divide {
  margin: 8px 0;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  width: 100%;
}
.citem_title {
  width: 120px;
}
.citem_content {
  width: calc(100% - 120px);
  display: flex;
  flex-wrap: wrap;
}
.tags{
        padding: 1px 8px;
    background: #f0f0f0;
    border-radius: 2px;
    border: 1px solid #e9e9e9
}
</style>